<!doctype html>
<html>

<head>
    <meta charset="utf-8" />
    <meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" />
    <title>{{community_name}}</title>
    <link rel="stylesheet" type="text/css" href="../css/community.css">
    <style>
        .s-bg-img {
            background-image: url({{community_bg_url}});
        }
    </style>
    <script>
        var community_id = {{community_id}};
    </script>
</head>

<body>
    <div class="m-pg" id="app">
        <div class="s-bg-fixed s-bg-img"></div>
        <header>
            <div class="m-ct">
                <div class="m-lt">
                    <div class="m-blur">
                        <div class="s-blur s-bg-img"></div>
                    </div>
                    <div class="u-info">
                        <h1>{{community_name}}</h1>
                        <p>{{community_desc}}</p>
                    </div>
                </div>
                <div class="m-rt s-bg-img"></div>
            </div>
        </header>
        <transition name="begin" mode="out-in">
            <div class="loading" v-if="isLoadingShow">
                <div id="loading-center">
                    <div id="loading-center-absolute">
                        <div class="object"></div>
                        <div class="object"></div>
                        <div class="object"></div>
                        <div class="object"></div>
                        <div class="object"></div>
                        <div class="object"></div>
                        <div class="object"></div>
                        <div class="object"></div>
                        <div class="object"></div>
                        <div class="object"></div>
                    </div>
                </div>
            </div>
            <section class="m-ct" v-else>
                <div class="m-send">
                    <p class="u-stat">今日新增 <b>{{newmember_count}}</b> 人</p>
                    <p class="u-stat">等待发送 <b v-text="wait_to_send"></b> 人</p>
                    <p class="u-stat">上次发送时间 <b>{{lastsend}}</b></p>
                    <div class="m-edit">
                        <textarea v-model="sendData" maxlength="200"></textarea>
                        <div v-text="sendData.length+'/200'"></div>
                    </div>
                    <a class="u-btn" @click="eSub"><span>群发信息</span> <i class="u-icon">&#xe63d;</i></a>
                    <a class="u-btn" @click="eSave"><span>储存为模板</span> <i class="u-icon">&#xe601;</i></a>
                    <a class="u-btn" @click="eGet"><span>使用模板</span> <i class="u-icon">&#xe621;</i></a>
                </div>
                <div class="m-user">
                    <div class="u-user" v-for="item in userlist">
                        <div class="u-user__hd"><i class="u-icon">&#xe6d2;</i></div>
                        <div class="u-user__bd"><em v-text="item.username"></em></div>
                        <div class="u-user__ft" v-text="item.join_time"></div>
                    </div>
                    <a class="u-btn" :class="{'z-not':notLoad}" @click="eLoadMore"> <span>加载更多</span> <i class="u-icon">&#xe606;</i></a>
                </div>
            </section>
        </transition>
        <footer>

        </footer>
        <transition name="dialog">
            <m-dialog v-if="alert" @eclick="eDialogClick" :msg="alert"></m-dialog>
        </transition>
    </div>
    <div>
        <template id="dialog">
            <div class="m-dialog">
                <div class="u-mask"></div>
                <div class="m-dialog-msg">
                    <div class="m-dialog-msg__hd">群发娘：</div>
                    <div class="m-dialog-msg__bd" v-html="msg"></div>
                    <div class="m-dialog-msg__ft">
                        <a class="u-btn" @click="eClick">知道了</a>
                    </div>
                </div>
            </div>
        </template>
    </div>
    <script src="http://cdn.bootcss.com/jquery/3.1.1/jquery.min.js"></script>
    <script src="http://cdn.bootcss.com/vue/2.0.0/vue.min.js"></script>
    <script src="http://cdn.bootcss.com/vue-resource/1.0.3/vue-resource.min.js"></script>
    <script src="../js/community.js"></script>
</body>

</html>